<script setup>
import {ref} from "vue";
import TableComponent from "@/components/TableComponent.vue";
import TeacherFormComponent from "@/components/form/TeacherFormComponent.vue";

const title = ref([
  {
    propName: 'name',
    name: '姓名',
  },
  {
    propName: 'id',
    name: '教师编号',
  },
  {
    propName: 'sex',
    name: '性别',
  },
  {
    propName: 'phone',
    name: '电话',
  }
])
const data = ref([
  {
    name: '张三',
    teacherId: '001',
    age: 30,
    sex: '男',
    phone: '1234567890',
  },
  {
    name: '李四',
    teacherId: '002',
    age: 35,
    sex: '女',
    phone: '0987654321',
  },
  {
    name: '王五',
    teacherId: '003',
    age: 28,
    sex: '男',
    phone: '1111111111',
  },
  {
    name: '赵六',
    teacherId: '004',
    age: 32,
    sex: '女',
    phone: '2222222222',
  }
])
const url = ref({
  deleteUrl: '',
  editUrl: '',
  searchUrl: '/teacher/get-search',
  showUrl: '/teacher/get-all-teachers',
  getCountUrl: '/teacher/get-teacher-count',
})
const formVisible = ref(false)
const handleDialogCancel = (visible) => {
  formVisible.value = visible
  console.log('cancel', visible)
}
</script>

<template>
  <div class="container">
    <div class="table-container">
      <TableComponent class="table" :title="title" :data="data" :url="url" form-type="Teacher"/>
    </div>
  </div>
</template>

<style scoped>
.container {
  width: 100%;
}
</style>
